<template>
  <div class="home-container" id="top">
    <!-- 顶部模块 -->
    <topbar></topbar>
    <!-- 轮播图模块 -->
    <lunBo></lunBo>
    <!-- 六宫格导航模块 -->
    <nav-box></nav-box>
    <!-- span 热门新品 -->
    <div class="title">优惠券领券直播</div>
    <!-- 商品展示区域 -->
    <goods></goods>

  </div>
</template>

<script>
// 引入子组件---topbar
import topbar from "../../compoents/home/topbar.vue";
// 轮播图模块  --subcompoents
import lunBo from "../../compoents/subcompoents/lunbotu.vue";
// 六宫格导航模块--
import navBox from "../../compoents/home/nav.vue";
// 引入商品展示区域
import goods from "../../compoents/home/goodsList.vue";

export default {
  components: {
    topbar,
    lunBo,
    navBox,
    goods
  }
};
</script>

<style lang="scss" scoped>
.home-container {
  z-index: -1;
  .title {
    margin-top: 10px;
    width: 100%;
    height: 40px;
    font-weight: 600;
    line-height: 40px;
    padding-left: 20px;
    color: red;
    border-bottom: 1px solid #dedede;
  }
}
</style>
